
.flex-row{display: flex;}
.flex-col{display: flex; flex-direction: column;}

.flex-row-between{display: flex; justify-content: space-between;}
.flex-row-col-between{display: flex; justify-content: space-between; align-items: space-between;}
.flex-row-around{display: flex; justify-content: space-around;}
.flex-row-center{display: flex; justify-content: center;}

.flex-row-col-center{display: flex; justify-content: space-between; align-items: center;}
.flex-row-col-around{display: flex; justify-content: space-around; align-items: center;}
.flex-col-between{display: flex; flex-direction: column; justify-content: space-between;}
.flex-col-around{display: flex; flex-direction: column; justify-content: space-around;}
.flex-col-center{display: flex; flex-direction: column; justify-content: center;}

.align-start{align-items: flex-start;}
.align-end{align-items: flex-end;}
.align-center{align-items: center;}

/* 换行 */
/* 多行交叉轴 */

/* 子级设置 */
.flex-1{flex:1;}
.flex-2{flex:2;}
.flex-3{flex:3;}
.flex-4{flex:4;}
.flex-5{flex:5;}
.flex-6{flex:6;}
.flex-7{flex:7;}
.flex-8{flex:8;}
.flex-9{flex:9;}